<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>美嘉饲料</title>
<link rel="stylesheet" href="/m/css/style.css">
<link href="<%=basePath%>skin/css/validform/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=basePath%>skin/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="<%=basePath%>skin/js/validform/Validform_v5.3.2_min.js"></script>
<script type="text/javascript" src="<%=basePath%>skin/js/jquery.lSelect.js"></script>
<script type="text/javascript" src="<%=basePath%>m/js/common.js"></script>
<script type="text/javascript">
	$().ready(function(){
		// 地区选择
		$("#areaId").lSelect({
			url: "<%=basePath%>area.shtml"
		});
		
		 //验证
		 var validform = $("#form0").Validform({
			btnSubmit:"#saveReceiver",
			tiptype:1
		 });
		 validform.addRule([
			{
			    ele:"#consignee",
			    datatype:"*",
			    nullmsg:"请输入收货人！"
			},
			{
			    ele:"#address",
			    datatype:"*",
			    nullmsg:"请输入地址！"
			},
			{
			    ele:"#zipCode",
			    datatype:"p",
			    nullmsg:"请输入邮编！"
			},
			{
			    ele:"#phone",
			    datatype:"*",
			    nullmsg:"请输入联系电话！"
			}
		 ]);
		 
		$("#addReceiver").click(function(){
			$("#newReceiver").show();
		});
		$("#cancelReceiver").click(function(){
			$("#newReceiver").hide();
		});
		
		$("#isInvoice").click(function(){
			$("#newInvoiceTitle").toggle();
		});
		
		var $submit = $("#submitOrder");
		$submit.click(function(){
			var finalReceiverId = $("input[name='receiverIds']:checked").val();
			$("#receiverId").val(finalReceiverId);
			// 校验
			$.ajax({
				url: "<%=basePath%>m/member/order/create.shtml",
				type: "POST",
				data: $("#form1").serialize(),
				dataType: "json",
				cache: false,
				beforeSend: function() {
					$submit.prop("disabled", true);
				},
				success: function(data) {
					var success = data.success;
					if (success == "true") {
						location.href = "<%=basePath%>m/member/order/payment.shtml?id=" + data.id;
					} else {
						setTimeout(function() {
							location.reload(true);
						}, 3000);
					}
				},
				complete: function() {
					$submit.prop("disabled", false);
				}
			});
		});
	});
</script>
</head>
<body>
	<c:import url="/m/layouts/top.jsp" />
	<a name="top"></a>
	<!--header-->
	<header>
		<div class="header">
			<a href="/m/cart.shtml" class="header-a-back"><span>返回</span></a>
			<a href="/m/index.html" class="header-a-home"><span>首页</span></a>
			<h2>核对订单</h2>
		</div>
	</header>
	<div class="order-i">
		<div class="order-t">
		<div class="order-title">收货人信息</div>
		<form id="form0" name="form0" method="post" action="<%=basePath%>m/member/order/receiver/save.shtml">
	          	<c:forEach items="${member.receivers }" var="receiver">
				<div class="order-info">
					<input type="radio" name="receiverIds" value="${receiver.id}" <c:if test="${receiver.isDefault != null && receiver.isDefault}">checked</c:if>/>
					<span>${receiver.consignee }</span><span>${receiver.phone }</span><br>
					<span>${receiver.address }</span>
				</div>
			</c:forEach>
			<div class="order-info" id="addReceiver">添加收货地址</div>
	              <div class="order-info" id="newReceiver" style="display:none">
	              	<div class="jutiitem">收货人：　     <input type="text" id="consignee" name="consignee" size="30"/></div>
	                  <div class="jutiitem">地区：　    <input type="hidden" id="areaId" name="areaId" /></div>
	                  <div class="jutiitem">地址：　　<input type="text" id="address" name="address" size="30" class="heduiText"/></div>
	                  <div class="jutiitem">邮编：　　<input type="text" id="zipCode" name="zipCode" size="30" class="heduiText" /></div>
	                  <div class="jutiitem">电话：        <input type="text" id="phone" name="phone" size="30" class="heduiText"/></div>
	                  <div class="jutiitem">是否默认：<input type="checkbox" id="isDefault" name="isDefault" value="true"/></div>
	                  <div class="jutiitem">
	                   <input type="button" value="确定" class="btnSub" id="saveReceiver">
				    <input type="button" value="取消" class="btnQuit" id="cancelReceiver">
	                 </div>
	              </div>
		</form>
<form id="form1" name="form1" method="post">
<input type="hidden" id="receiverId" name="receiverId"/>
<input type="hidden" name="cartToken" value="${cartToken}" />
		<div class="order-title">支付方式</div>
		<div class="order-info">
			<ul>
				<c:forEach items="${paymentMethods }" var="paymentMethod">
					<li><input type="radio" name="paymentMethodId" value="${paymentMethod.id }" />${paymentMethod.name }</li>
				</c:forEach>
			</ul>
		</div>
		<div class="order-title">配送方式</div>
		<div class="order-info">
			<ul>
				<c:forEach items="${shippingMethods }" var="shippingMethod">
					<li><input type="radio" name="shippingMethodId" value="${shippingMethod.id }" />${shippingMethod.name }</li>
				</c:forEach>
			</ul>
		</div>
		<div class="order-title">发票信息</div>
		<div class="order-info">
			<ul>
				<li>开具发票：<input type="checkbox" id="isInvoice" name="isInvoice" value="true"/></li>
				<li id="newInvoiceTitle" style="display:none">发票抬头：<input id="invoiceTitle" name="invoiceTitle" class="fapiaoText"/></li>
			</ul>
		</div>
		<div class="order-title">商品清单</div>
		<div class="order-info">
			<table width="100%" cellspacing="0" cellpadding="0">
				<tr class="qingdantr">
					<td>商品</td>
					<td>单价</td>
					<td>数量</td>
					<td>小计</td>
				</tr>
				<c:forEach items="${order.orderItems }" var="orderItem">
					<tr>
						<td>${orderItem.name }</td>
						<td><fmt:formatNumber value="${orderItem.price }" pattern="0.00"/></td>
						<td>${orderItem.quantity }</td>
						<td><fmt:formatNumber value="${orderItem.subtotal }" pattern="0.00"/></td>
					</tr>
				</c:forEach>
			</table>
		</div>
	</div>
	<div class="totle-cont">
		<div class="tbl-type">
			<div class="tbl-type">
				<span class="tbl-cell">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;运费</span><span class="tbl-cell text-right">￥${order.fee }</span>
			</div>
			<div class="tbl-type">
				<span class="tbl-cell">应付金额</span><span class="tbl-cell text-right">￥<fmt:formatNumber value="${order.amount}" pattern="0.00"/></span>
			</div>
		</div>
	</div>
	<div class="new-abtn-type">
		<a href="javascript:;" id="submitOrder">提交订单</a>
	</div>
   </div>
   <c:import url="/m/layouts/foot.jsp" />
</body>
</html>
